﻿<!DOCTYPE html>
<html lang="en">
    <head>
        <title>OSCEND</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

        <!-- Styles -->
        <link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/font-awesome.4.6.0.css">
        <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
        <link href='https://fonts.googleapis.com/css?family=Playfair+Display:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
        <link href='https://fonts.googleapis.com/css?family=Raleway:400,700,300' rel='stylesheet' type='text/css'>
        <link href="fonts/Stroke-Gap-Icons-Webfont/style.css" rel="stylesheet" type="text/css" />

        <!-- components -->
        <link href="vendor/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="vendor/owl-carousel/owl-carousel/owl.carousel.css" rel="stylesheet" type="text/css" /> 
        <link href="vendor/slider-pro/dist/css/slider-pro.min.css" rel="stylesheet" type="text/css" /> 
        <link href="vendor/slick-carousel/slick/slick.css" rel="stylesheet" type="text/css" /> 
        <link href="vendor/animate.css/animate.min.css" rel="stylesheet" type="text/css" /> 

        <link href="css/main.css" rel="stylesheet" type="text/css" />

    </head>
    <body data-scrolling-animations="true">

        <div id="page-preloader"><span class="spinner"></span></div>

        <!-- ========================== -->
        <!-- Navigation -->
        <!-- ========================== -->
        <header class="header scrolling-header">
            <nav id="nav" class="navbar navbar-default navbar-fixed-top" role="navigation">
                <div class="container relative-nav-container">
                    <a class="toggle-button visible-xs-block" data-toggle="collapse" data-target="#navbar-collapse">
                        <i class="fa fa-navicon"></i>
                    </a>
                    <a class="navbar-brand scroll" href="home.html">
                        <img class="normal-logo hidden-xs" src="img/logo.png" alt="logo" />
                        <img class="scroll-logo hidden-xs" src="img/logo-dark.png" alt="logo" />
                        <img class="scroll-logo visible-xs-block" src="img/logo-free.png" alt="logo" />
                    </a>
                    <ul class="nav navbar-nav navbar-right nav-icons wrap-user-control">
                        <li>
                            <a id="search-open" href="#fakelink"><i class="fa fa-search"></i></a>
                        </li>
                        <li class="open-signup">
                            <a href="#fakelink"><i class="fa fa-user"></i></a>
                        </li>
                    </ul>
                    <div class="navbar-collapse collapse floated" id="navbar-collapse">
                        <ul class="nav navbar-nav navbar-with-inside clearfix navbar-right with-border"> 
                            <li><a href="index.html">Home</a></li>
                            <li><a href="about.html">About</a></li>
                            <li><a href="services.html">Services</a></li>
                            <li><a href="contact.html">Contacts</a></li>
                        </ul>
                    </div>
                </div>
                <div class="navbar-search ">
                    <div class="container">
                        <form>
                            <div class="input-group">
                                <input type="text" placeholder="Type your search..." class="form-control" autocomplete="off">
                                <span class="input-group-btn">
                                    <button type="reset" class="btn search-close" id="search-close">
                                        <i class="fa fa-close"></i>
                                    </button>
                                </span>
                            </div>
                        </form>
                    </div>
                </div>
            </nav>
        </header><!--./navigation -->

        <!-- ========================== -->
        <!-- CONTACT - HEADER -->
        <!-- ========================== -->
        <section class="top-header countact-us-header with-bottom-effect transparent-effect dark dark-strong">
            <div class="bottom-effect"></div>
            <div class="header-container">	
                <div class="header-title">
                    <div class="header-icon"><span class="icon icon-Wheelbarrow"></span></div>
                    <div class="title">contact us</div>
                    <em>Lorem ipsum dolor amet</em>
                </div>
            </div><!--container-->
        </section>  

        <section class="countact-us-section">
            <div class="container">
                <div class="row">
                    <div class="col-md-8">
                        <div class="contact-form">
                            <div class="form-heading">
                                <h3>send a message</h3>
                                <em>Lorem ipsum dolor sit amet adipisicing</em>
                            </div>
                            <div class="form-description">
                                <p>Amco laboris nisi ut aliquip xea commodo consequt. Duis aute irure dolor reprehenderit voluptate velit esla fugit lore ipsum dolor
                                    sit consectetur adipisicing elit sed do eiusmod tempor incididunt bore aliqua ute enim ad mid veniam quis nostrud exercitation
                                    ullamco. Lorem ipsum dolor sit amet consectetur adipisicing elit sed do eiusmod.
                                </p>
                            </div>
                            <form method="post" action="sendEmail.php" name="contact-form" id="contact-form">
                                <div id="response"></div>
                                <div class="row"> 
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <input type="text" name="firstName" id="firstName"  placeholder="YOUR NAME" class="form-control" />
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <input type="text" name="lastName" id="lastName" placeholder="YOUR NAME" class="form-control" />
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <input type="text" name="phone" id="phone" placeholder="PHONE NO." class="form-control" />
                                        </div>
                                    </div> 
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <input type="text" name="subject"  id="subject" placeholder="SUBJECT" class="form-control" />
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <textarea class="form-control" name="message" id="message" placeholder="MESSAGE"></textarea>
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="form-group"> 
                                            <button type="submit" id="submit" class="btn btn-default">send message</button>
                                        </div>
                                    </div> 
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="row">
                            <div class="col-md-12 col-sm-6">
                                <div class="contact-map" >
                                    <div id="contactMap"></div>
                                </div>
                            </div>
                            <div class="col-md-12 col-sm-6">
                                <div class="contact-block">
                                    <h5>keep in touch</h5>
                                    <div class="row ">
                                        <div class="col-md-12 clearfix">
                                            <div class="type-info pull-left">
                                                <i class="icon icon-House"></i>
                                                address
                                            </div>
                                            <div class="info pull-right text-right">
                                                <p class="no-margin">68 Landsriver Street, California 22066</p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 clearfix">
                                            <div class="type-info pull-left">
                                                <i class="icon icon-Phone2"></i>
                                                phone
                                            </div>
                                            <div class="info pull-right text-right">
                                                <p class="no-margin">+201 126 216 88     +201 126 216 88</p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 clearfix">
                                            <div class="type-info pull-left">
                                                <i class="icon icon-Mail"></i>
                                                email
                                            </div>
                                            <div class="info pull-right text-right">
                                                <p class="no-margin">support@oscend.com</p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 clearfix">
                                            <div class="type-info pull-left">
                                                <i class="icon icon-Mouse"></i>
                                                Skype Chat
                                            </div>
                                            <div class="info pull-right text-right">
                                                <p class="no-margin">oscend.live</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </section>

        <!-- ========================== -->
        <!-- FOOTER -->
        <!-- ========================== -->
        <footer>
            <!-- ========================== -->
            <!-- BUY SECTION -->
            <!-- ========================== -->
            <section class="buy-section with-icon">
                <div class="section-icon"><span class="icon icon-Umbrella"></span></div>
                <div class="container">
                    <div class="row">
                        <div class="col-md-8 col-md-offset-1 col-sm-9 wow fadeInLeft">
                            <div class="section-text">
                                <div class=" vcenter like">
                                    <span class="icon icon-Like"></span> 
                                </div>
                                <div class="buy-text vcenter">
                                    <div class="top-text">oscend - a creative & multipurpose template</div>
                                    <div class="bottom-text">Lorem ipsum dolor sit amet consectetur elit sed</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-3  wow fadeInRight">
                            <a href="#" class="btn btn-info ">Buy it now</a>
                        </div>
                    </div>
                </div>
            </section>
            <!-- ========================== -->
            <!-- FOOTER - SOCIAL -->
            <!-- ========================== -->
            <section class="social-section dark dark-strong">
                <div class="container dark-content">
                    <div class="tt">We are social 24/7 - Get in touch</div>
                    <ul class="list-socials">
                        <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                        <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                        <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                        <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                        <li><a href="#"><i class="fa fa-dribbble"></i></a></li>
                        <li><a href="#"><i class="fa fa-pinterest-p"></i></a></li>
                    </ul>
                </div>
            </section>

            <!-- ========================== -->
            <!-- FOOTER - FOOTER -->
            <!-- ========================== -->
            <section class="footer-section">
                <div class="container">
                    <div class="row">
                        <div class="col-md-3 col-sm-3">
                            <h5>about us</h5>
                            <p>Lorem ipsum dolor sit amet consect etural
                                adipisicing elit sed don eiusmod temp enim
                                minim veniam quis notrud exercitation lore
                                ipsum dolor sit amet.</p>
                        </div>
                        <div class="col-md-3 col-sm-3">
                            <h5>Sitemap</h5>
                            <div class="row">
                                <div class="col-md-6">
                                    <ul class="footer-nav">
                                        <li><a href="#">About Us</a></li>
                                        <li><a href="#">Portfolio</a></li>
                                        <li class="active"><a href="#">Latest News</a></li>
                                        <li><a href="#">Contact us</a></li>
                                    </ul>
                                </div>
                                <div class="col-md-6">
                                    <ul class="footer-nav">
                                        <li><a href="#">Get Help</a></li>
                                        <li><a href="#">Careers</a></li>
                                        <li><a href="#">FAQ's</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-3 col-sm-3">
                            <h5>Contact info</h5>
                            <ul class="contacts-list">
                                <li>
                                    <p><i class="icon icon-House"></i>68 Landsriver Street, California  USA 22036</p>
                                </li>
                                <li>
                                    <p><i class="icon icon-Phone2"></i>0800 126 01268</p>
                                </li>
                                <li>
                                    <p><i class="icon icon-Mail"></i><a href="mailto:support@oscend.com">support@oscend.com</a> </p>

                                </li>
                            </ul>
                        </div>
                        <div class="col-md-3 col-sm-3">
                            <h5>newsletter</h5>
                            <p>
                                Subscribe to our newsletter for latest updates 
                                about our creative agency
                            </p>
                            <div class="form-group has-feedback">
                                <input type="email" class="form-control " placeholder="Email address ...">
                                <i class="icon icon-Mail form-control-feedback"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <section class="copyright-section">
                <p>Copyright &copy; 2017.Company name All rights reserved.</p>
            </section>
        </footer>



        <!-- Scripts -->

        <!-- components -->
        <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
        <script src="vendor/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
        <script src="vendor/bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
        <script src="vendor/owl-carousel/owl-carousel/owl.carousel.min.js" type="text/javascript"></script>
        <script src="vendor/waypoints/lib/jquery.waypoints.min.js" type="text/javascript"></script>
        <script src="vendor/slider-pro/dist/js/jquery.sliderPro.min.js" type="text/javascript"></script>
        <script src="vendor/slick-carousel/slick/slick.min.js" type="text/javascript"></script>
        <script src="vendor/jquery.mb.ytplayer/dist/jquery.mb.YTPlayer.min.js" type="text/javascript"></script>
        <script src="vendor/wow/dist/wow.min.js" type="text/javascript"></script>
        <script src="js/modernizr.js" type="text/javascript"></script>

        <!---<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>--->
        <!-- custom scripts -->
        <script src="js/contact.js" type="text/javascript"></script>
        <script src="js/custom.js" type="text/javascript"></script>
        <script src="js/map.js" type="text/javascript"></script>

    </body>
</html>

